<template>
	<div>
		<div class="i_index_title">
			<span class="index_title">更换头像</span>
			<van-icon class="fanhui" size="30" @click="fanhui" name="arrow-left" />
			<div class="youbian">
				<van-uploader :after-read="onRead2">
					<van-icon name="ellipsis" size="30"/>
				</van-uploader>
			</div>
		</div>
		
		<div class="bgc">
			<div class="oimg">
				<!-- <img :src="hallImg[0]." alt=""> -->
			</div>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return {
				hallImg:[],
				value:''
			}
		},
		created() {
			
		},
		methods:{
			onRead2(file) {
				let content = file.file;
				console.log(file)
				this.$axios.post('http://a.chuxingcai.com/prod-api/common/upload',file.file,
				{ 
					header:{
						token:window.sessionStorage.getItem('token')
					}
				}).then((res)=>{
					console.log(res)
				})
				
				// let content = file.file;
    //     let data = new FormData();
    //     data.append('img',content);
    //     this.$axios.post('图片上传地址',data)
    //     .then((res) => {
    //         let datas = res.data.datas.path;
    //         // this.msg.hallImg.push(`api地址${datas}`);
    //     })
				
			},
			fanhui(){
				this.$router.go(-1);
			},
			base64ImgtoFile(dataurl, filename = 'file') {
			  let arr = dataurl.split(',')
			  let mime = arr[0].match(/:(.*?);/)[1]
			  let suffix = mime.split('/')[1]
			  let bstr = atob(arr[1])
			  let n = bstr.length
			  let u8arr = new Uint8Array(n)
			  while (n--) {
			    u8arr[n] = bstr.charCodeAt(n)
			  }
			  return new File([u8arr], `${filename}.${suffix}`, {
			    type: mime
			  })
			}
		}
	}
</script>

<style scoped>
	.i_index_title{
		width: 100%;
		height: 50px;
		background-color: black;
		color: white;
		position: relative;
		z-index: 3;
	}
	.fanhui{
		position: absolute;
		top: 50%;
		transform: translate(0,-50%);
		color: white;
	}
	.youbian{
		position: absolute;
		top: 50%;
		right: 10px;
		transform: translate(0,-50%);
		color: white;
	}
	.index_title{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		color: white;
	}
	.bgc{
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: black;
	}
	.oimg{
		width: 100%;
		height: 350px;
		border: 1px solid red;
		position: absolute;
		top: 50%;
		transform: translate(0,-50%);
	}
</style>
